<template>
  <div>
    <!-- 标题 -->
    <Nav :title="title"></Nav>
    <!-- 图片说明 -->
    <div class="header-b" v-if="list.data">
      <img class="img" :src="list.data.app_list_pic_url" alt="">
      <div class="txt">
        {{ list.data.name }}
      </div>
    </div>
    <div class="m-txt" v-if="list.data">
      {{ list.data.simple_desc }}
    </div>

    <!-- 商品展示 -->
    <Product :data="data"></Product>>
    <!-- <div class="footer-goods" v-if="list.goodsList">
      <ul class="newGoodList">
          <li
            class="newGoodList-item"
            v-for="el in list.goodsList"
            :key="el.id"
            @click="toGoodsDetail(el.id)"
          >
            <img class="img" :src="el.list_pic_url" alt="" />
            <div class="goods-txt">
              <span class="txt-t">{{ el.name }}</span>
              <span class="txt-b">{{ el.retail_price }}</span>
            </div>
          </li>
          <li></li>
        </ul>
    </div> -->
  </div>
</template>

<script>
import { detailaction } from '@/api/home/home'
import { useRoute, useRouter } from 'vue-router'
import { ref } from 'vue'
import Product from '@/components/Product.vue'
export default {
  name: 'brandList',
  setup () {
    const route = useRoute()
    const title = ref('品牌制造商品')
    const router = useRouter()
    const list = ref({})
    const id = ref('')
    const data = ref([])
    id.value = route.query.id
    detailaction({ id: id.value }).then(res => {
      console.log(res)
      data.value = res.goodsList
      list.value = res
      console.log('list.value', list.value)
      console.log('data', list.value.data)
    })
    const toGoodsDetail = (id) => {
      router.push({
        path: '/home/goodsDetail',
        query: { id: id }
      })
    }
    return { id, list, title, toGoodsDetail, data }
  },
  components: { Product }
}
</script>

<style lang="scss" scoped>
@import "./scss/index.scss";
</style>
